
<template>
	<!--  移动端 我的  优惠券 -->
	<view class="page">
		<!-- 优惠券tab -->
		<view class="coupon-tab">
			<view class="tab" :class="{'action':TabShow===0}" @click="onCouponTab(0)">
				<text>待领取</text>
				<text class="line"></text>
			</view>
			<view class="tab" :class="{'action':TabShow===1}" @click="onCouponTab(1)">
				<text>未使用</text>
				<text class="line"></text>
			</view>
			<view class="tab" :class="{'action':TabShow===2}" @click="onCouponTab(2)">
				<text>已使用</text>
				<text class="line"></text>
			</view>
			<view class="tab" :class="{'action':TabShow===3}" @click="onCouponTab(3)">
				<text>已过期</text>
				<text class="line"></text>
			</view>
		</view>
		<!-- 优惠券列表 -->
		<view class="coupon-list">
			<view class="list" v-for="(item,index) in Coupon.length" :key="index">				
				<view class="list-data" :class="{'coupon-lose':TabShow>1}">
					<view class="coupon-price">
						<view class="discounts">
							<text class="min">￥</text>
							<text class="max">{{Coupon[index].price}}</text>
						</view>
						<view class="full-reduction"><text>满{{Coupon[index].full}}元减{{Coupon[index].price}}元</text></view>
						<view class="jag"></view>
					</view>
					<view class="coupon-info">
						<view class="info-title">
							<view class="tag"><text>全品类券</text></view>
							<view class="title"><text>可购买所有商品</text></view>
						</view>
						<view class="date-get">
							<view class="date"><text>{{Coupon[index].getTime}}</text></view>
							<view class="get" @click="onCouponUse" v-if="TabShow===1">
								<text>立即使用</text>
							</view>
							<view class="get" @click="getCoupon(Coupon[index].couponId)" v-if="TabShow===0">
								<text>立即领取</text>
							</view>
						</view>
					</view>
				</view>			
				<view class="use-status" v-if="TabShow != 0">
					<text v-if="TabShow === 1">未使用</text>
					<text v-else-if="TabShow === 2">已使用</text>
					<text v-else-if="TabShow === 3">已过期</text>
				</view>
				<view class="describe" v-show="isDes">
					<text>全品类：可购买所有商品</text>
				</view>
			</view>
		</view>		
	</view>
</template>

<script>
import {baseUrl} from "../../config/baseUrl.js"
export default {
	data() {
		return {
			nowTime:'',
			TabShow: 0,
			isDes: false,
			Coupon:[],
		};

	},
	onLoad(){
		 this.Coupon=uni.getStorageSync("newCoupons")
		 console.log("新优惠券：",this.Coupon)
		console.log("新优惠券数量：",this.Coupon.length)
		// this.num = this.Coupon.length
	},
	methods:{
		/* 领取优惠券 */
		getCoupon(e){
			console.log("优惠券id：",e)
			uni.request({
				url:baseUrl+"/user/getCoupon",
				method:"POST",
				header:{"Content-Type": "application/x-www-form-urlencoded",
				},
				data:{
					userId:uni.getStorageSync("userId"),
					couponId:e,		
				},
				success: (res) => {
					if(res.data==0){
						uni.showToast({
							title:"已达领取上限",
							icon: 'error',
							mask:true,
						})
					}else{
						uni.showToast({
							title:"领取成功！",
							icon: 'success',
							mask:true,
						})
					}
				}
			})

		},
		
		/* 获取当前时间 */
		getNowTime(){
			var datetime = new Date();
			var year = datetime.getFullYear();
			var month = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
			var date = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();			 
			this.nowTime = year + "-" + month + "-" + date;
		},
		/**
		 * 优惠券tab点击
		 * @param {Number} type
		 */
		onCouponTab(type){
			if(type==0){
				this.getNowTime(),
				this.Coupon.length=0;
				uni.request({
					url:baseUrl+"/user/noGetCoupon",
					method:'POST',
					header:{"Content-Type": "application/x-www-form-urlencoded",
					},
					data:{
						shopsId:uni.getStorageSync("shopsId"),				
					},
					success:(res)=>{
						if(res.data.tblCoupons==null){
						 console.log("请先去填写地址，该地区暂无分店和优惠券！")
							 uni.setStorageSync("newCoupons",null)
						}else{
						for(var i=0;i<res.data.tblCoupons.length;i++){
							let result = Date.parse(res.data.tblCoupons[i].getTime.trim().replace(/-/g, '/')) > Date.parse(this.nowTime.trim().replace(/-/g, '/'));										 
							if(result) { 
								this.Coupon.push(res.data.tblCoupons[i])
								}else {
								console.log(res.data.tblCoupons[i].getTime+"小于"+this.nowTime) 
							}																																						
						}	
					console.log("待领取的优惠券:",this.Coupon)
						}
					}								
				})
			}else if(type==1){
				uni.request({
					url:baseUrl+"/user/noUseCoupon",
					method:'POST',
					header:{"Content-Type": "application/x-www-form-urlencoded",
					},
					data:{
						userId:uni.getStorageSync("userId"),
				
					},
					success:(res)=>{	
						console.log("未使用的优惠券:",res.data.noUseCoupons)
						uni.setStorageSync("noUseCoupons",res.data.noUseCoupons)
						this.Coupon = res.data.noUseCoupons
					}								
				})
			}else if(type==2){
				uni.request({
					url:baseUrl+"/user/usedCoupon",
					method:'POST',
					header:{"Content-Type": "application/x-www-form-urlencoded",
					},
					data:{
						userId:uni.getStorageSync("userId"),
				
					},
					success:(res)=>{	
						console.log("已使用的优惠券:",res.data.usedCoupons)
						uni.setStorageSync("usedCoupons",res.data.usedCoupons)
						this.Coupon = res.data.usedCoupons
					}								
				})
			}else if(type==3){
				this.getNowTime(),
				this.Coupon.length=0;
				uni.request({
					url:baseUrl+"/user/noGetCoupon",
					method:'POST',
					header:{"Content-Type": "application/x-www-form-urlencoded",
					},
					data:{
					   shopsId:uni.getStorageSync("shopsId"),			
					},
					success:(res)=>{						
						for(var i=0;i<res.data.tblCoupons.length;i++){
								let result = Date.parse(res.data.tblCoupons[i].getTime.trim().replace(/-/g, '/')) > Date.parse(this.nowTime.trim().replace(/-/g, '/'));										 
								if(result) {
									console.log("未过期的优惠券",res.data.tblCoupons)
									}else {
									this.Coupon.push(res.data.tblCoupons[i])
								}																																						
							}	
						console.log("已过期的优惠券:",this.Coupon)
					}								
				})
			}		
			this.TabShow = type;
		},
		/**
		 * 去使用点击
		 */
		onCouponUse(){
			uni.navigateTo({
				url: '/pages/SearchGoodsList/SearchGoodsList'
			})
		}
	}
};
</script>

<style scoped lang="scss">
@import 'MyCoupon.scss';
</style>
